<!DOCTYPE html>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
    <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
    <%@page import="com.google.appengine.api.blobstore.BlobstoreService,com.google.appengine.api.blobstore.BlobstoreServiceFactory"%>
<%BlobstoreService blobstoreService = BlobstoreServiceFactory.getBlobstoreService(); %>
<html>
<head>
<title>Email Statistics</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script type="text/javascript" src="/js/jquery-1.7.1.js"></script>
<script type="text/javascript" src="/js/ui/jquery.ui.core.js"></script>
<script type="text/javascript" src="/js/ui/jquery.ui.widget.js"></script>
<script type="text/javascript" src="/js/ui/jquery.ui.datepicker.js"></script>
<script type="text/javascript"
	src="/js/ui/i18n/jquery.ui.datepicker-en-GB.js"></script>
	<script src="/js/jqgrid/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="/js/jqgrid/jquery.jqGrid.src.js" type="text/javascript"></script>
<script src="/js/ui/i18n/jquery-ui-i18n.js" type="text/javascript"></script>
<c:if test="${isAdmin }">
<script type="text/javascript" src="/js/main.js"></script>
</c:if>
<link type="text/css" href="/css/themes/base/jquery.ui.all.css"
	rel="stylesheet" />
<link rel="stylesheet" type="text/css" media="screen"
	href="/css/themes/base/jquery.ui.datepicker.css" />
<link rel="stylesheet" type="text/css" media="screen"
	href="/css/jqgrid/ui.jqgrid.css" />
<link type="text/css" href="/css/style.css"
	rel="stylesheet" />
</head>
<body>

<div id="container">
<div id="logoBar">
			<div style="float: left;" class="logo">
				<a href="/index.do"><img src="/images/logo.png">
				</a>
			</div>
			<div style="float: right;">${user}|<a href="/logout.do"> Logout
				</a>
			</div>
			</div>
<div class="menubar ui-corner-top ui-corner-bottom" style="clear: both">


			<span onclick="generateReportForm()" class="topMenu">
				Generate Report
			</span>
			
				<span onclick="generateDetailedReportForm()" class="topMenu">
				Detailed Report
			</span>
			
			  <span onclick="getImportForm();" class="topMenu"> 
				Import
				</span>  
				
			<span onclick="syncAllUsers();" class="topMenu"> 
				Sync Users
				</span>
				
				<span onclick="getUserList();" class="topMenu"> 
				User List
				</span>
</div>

<div style="margin-top:30px;min-height:400px;" id="middle">
<div id="msg">

<c:choose >
<c:when test="${not isAdmin }">
Only Approved Users can use this application
</c:when>
<c:when test="${not empty param.msg }">
<span style="color:green;font-weight:bold;font-size:14px;"> ${param.msg }</span>
</c:when>
<c:otherwise>

Please Use the menus above, or view an old report below.


</c:otherwise>
</c:choose>

</div>
<c:if test="${isAdmin }">
<br><br>
<div id="gridDiv">
<table id="list4" class="loadingBack" style="width: 100%;"></table>
<br><br>
<table id="list2" class="loadingBack" style="width: 100%;"></table>
</div>
</c:if>

</div>
</div>
<div id="importForm" style="display:none;">
<form  style="padding:10px;" action="<%= blobstoreService.createUploadUrl("/importFile.do") %>" method="post" enctype="multipart/form-data">
		CSV File :  <input type="file" name="myFile"><br><br>
		        <input type="submit" value="Upload"> <input type="button" value="Cancel" class="cancel" />
</form>
</div>
<!-- simple report form  -->
<div id="reportForm" style="display:none;">
<div id="errorMsg" style="font-weight:bold;color:red;font-size:14px;"></div><br>
 <form  style="padding:10px;" action="<%= blobstoreService.createUploadUrl("/generateReport.do") %>" method="post" enctype="multipart/form-data">
 <table>
   <tr>
 <td>CSV File </td>
 <td><input type="file"  name="reportFile" /></td>
 <td></td>
 </tr>
 <tr>
 <td>From Date</td>
 <td><input type="text" id="fromDate" style="width: 137px;" name="fromDate"/></td>
 <td></td>
 </tr>
   <tr>
 <td>To Date</td>
 <td><input type="text" id="toDate" style="width: 137px;" name="toDate"/></td>
 <td></td>
 </tr>
  <tr>
 <td >
 <input type="submit" id="submit" value="submit" >
 </td>
 <td><input type="button" value="Cancel"  class="cancel"  /> </td>
 <td></td>
 </tr>
 
 </table>
 
 </form>

</div>

<!-- detail report form  -->
<div id="detailReportForm" style="display:none;">
<div id="detailErrorMsg" style="font-weight:bold;color:red;font-size:14px;"></div><br>
 <form  style="padding:10px;" action="<%= blobstoreService.createUploadUrl("/generateDetailReport.do") %>" method="post" enctype="multipart/form-data">
 <table>
   <tr>
 <td>CSV File </td>
 <td><input type="file"  name="reportFile" /></td>
 <td></td>
 </tr>
 <tr>
 <td>From Date</td>
 <td><input type="text" id="detailFromDate" style="width: 137px;" name="fromDate"/></td>
 <td></td>
 </tr>
   <tr>
 <td>To Date</td>
 <td><input type="text" id="detailToDate" style="width: 137px;" name="toDate"/></td>
 <td></td>
 </tr>
  <tr>
 <td >
 <input type="submit" id="submit" value="submit" >
 </td>
 <td><input type="button" value="Cancel"  class="cancel"  /> </td>
 <td></td>
 </tr>
 
 </table>
 
 </form>

</div>
</body>
<script>
$(function() {
	$.datepicker.setDefaults($.datepicker.regional['']);
	//$("#fromDate").datepicker({changeMonth: true,changeYear: true, dateFormat: 'yy/mm/dd'});
	//$("#toDate").datepicker({changeMonth: true,changeYear: true, dateFormat: 'yy/mm/dd'});
	jQuery.jgrid.no_legacy_api = true;
	$("#list4").jqGrid(
        { datatype: "json",
	      url: '/getFileList.do',
	      autowidth: true, 
	      rownumbers: true, 
	      colNames:['key','File Name' , 'Month',  'Date','Created By'],
	      colModel:[    
	                {name:'key',hidden:true,index:'key', align:'left',  search:false,sortable:true},
	                    {name:'name',index:'title', align:'left',sortable:false,formatter:editLinkFormatter},
		    	         {name:'month',index:'address',align:'left',width:40,search:false,sortable:false},
		    	         {name:'date',index:'description',align:'left',width:60,sortable:false},
		    	         {name:'createdBy',index:'createdBy',align:'left',width:85,sortable:false},
		    	    ],
		    	        
		  caption: "Files",
		  viewrecords:true,
		  gridComplete: function()	{
			   jQuery("#list4").jqGrid('setGridHeight', 'auto'); 
		  }
		});
	
	$("#list2").jqGrid(
	        { datatype: "json",
		      url: '/getLogs.do',
		      autowidth: true, 
		      rownumbers: true, 
		      colNames:['Message' ,  'Date'],
		      colModel:[    
		                    {name:'Message',index:'Message', align:'left',sortable:false},
			    	         {name:'date',index:'description',align:'left',width:60,sortable:false},
			    	    ],
			    	        
			  caption: "Logs",
			  viewrecords:true,
			  gridComplete: function()	{
				   jQuery("#list2").jqGrid('setGridHeight', 'auto'); 
			  }
			});

		
});

function editLinkFormatter (cellvalue, options, rowObject)
{
	 return '<a href="/downloadReport.do?blobKeyStr=' + rowObject[0] + '&fileName=' + cellvalue+'">' + cellvalue + '</a>';
}
</script>
</html>